$(function() {

    // 头部HTML，到时候删了
    // var $span = $("<div class=header><div class='h-nav clearfix'><div class='logo fl'><img src='img/main/logo.png'/></div>" + "<div class='nav fr'><ul class='clearfix c9 f14'><li class=fl>" + "首页" + "<p class=on-2></p>" + "</li>" + "<li class=fl>" + "会员中心" + "<p class=on-2></p>" + "</li>" + "<li class=fl>" + "造型团队" + "<p class=on-2></p>" + "</li>" + "<li class=fl>" + "产品展示" + "<p class=on-2></p>" + "</li>" + "<li class='fl nav_on'>" + "形象打造" + "<span>∨</span>" + "</li>" + "<li class=fl>" + "时尚资讯" + "<p class=on-2></p>" + "</li>" + "<li class=fl>" + "关于我们" + "<p class=on-2></p>"  + "</ul>" + "<div class='nav_list disnone'><ul><li><span>服务项目<i></i></span></li>" + "<li><span>服务项目<i></i></span></li>" + "<li><span>服务项目<i></i></span></li>" + "<li><span>服务项目<i></i></span></li>" + "</ul></div>" + "</div>" + "</div></div>");
    // $("body").prepend($span)

    //下拉

    // $(window).scroll(function() {
    //     if ($(window).scrollTop() >= 80) {
    //         $(".h-nav").addClass("on-1");

    //     } else if ($(window).scrollTop() <= 80) {
    //         $(".h-nav").removeClass("on-1");
    //     }
    // })

    // 判断标签的高度出现动画

    // $(window).scroll(function() {
    //     if (($(window)).scrollTop() >= 80) {
    //         $(".header .h-nav").addClass("pf");
    //     } else if ($(window).scrollTop() <= 80) {
    //         $(".header .h-nav").removeClass("pf");
    //     }
    // })
    $(".nav li").hover(function() {
        $(".on-2", this).stop().animate({
            width: '100%'
        }, 700)
    }, function() {
        $(".on-2", this).stop().animate({
            width: '0'
        }, 700)
    });
    // $(".nav li").click(function(){
    //     $(this).css('color', '#e8b768').siblings().css('color', '#999999');
    //     $(".on-2",this).animate({
    //         width:"100%",
    //     },400).parent().siblings().children('p').css('width','0')

    // })
    // 二级导航
    $('.h-nav .nav_on,.nav_list').hover(function() {
        // $('.nav_on').css('color', '#e8b768');
        $('.nav_list').show()
        $('.nav_list').stop().animate({
            top: '81px',
            opacity: '1'
        })
    }, function() {
        $('.nav_on').css('color', '#787878');
        $('.nav_list').stop().animate({
            top: '71px',
            opacity: '0'
        }, function() {
            $('.nav_list').hide()
        })
    })

    $('.nav_list li').hover(function() {
        $(this).find('span').stop().animate({
            left: '40px'
        })
        $(this).find('i').text('>')
    }, function() {
        $(this).find('span').stop().animate({
            left: '30px'
        })
        $(this).find('i').text('')
    })

    // 焦点
    //手机号码焦点
    var iphone = $('.register-input .phone'); //手机号码
    var password = $('.register-input .password'); //手机号码

    iphone.focus(function() {
        if (iphone.val() == '') {
            iphone.val('手机号码');
        } else if (iphone.val() == '手机号码') {
            iphone.val('');
        }
        iphone.css({ 'border-color': '#e8b768', 'transition': '1s' })
    })
    iphone.blur(function() {
        if (iphone.val() == '') {
            iphone.val('手机号码');
        }
        iphone.css({ 'border-color': '#323232', 'transition': '1s' })
    })

    iphone.keyup(function() {
        this.value = this.value.replace(/[^\d]/g, '');
    })


    //密码焦点
    password.focus(function() {
        if (password.val() == '') {
            password.attr('type', 'text');
            password.val('密码');
        } else if (password.val() == '密码') {
            password.val('');
            password.attr('type', 'password');
        }
        password.css({ 'border-color': '#e8b768', 'transition': '1s' })
    })
    password.blur(function() {
        if (password.val() == '') {
            password.attr('type', 'text');
            password.val('密码');
        }
        password.css({ 'border-color': '#323232', 'transition': '1s' })
    })

    // 单选（记住登录状态）
    $('body').on("click", ".popup-text .checkbox-label", function() {
        if ($(this).find('input').attr("checked")) {
            $(this).find('input').removeAttr('checked');
        } else {
            $(this).find('input').attr('checked', '');
        }
        $(this).toggleClass('checked');
    })

    $('body').on("click", ".popup-text .register-prompt", function() {
        if ($(this).find('input').attr("checked")) {
            $(this).find('input').removeAttr('checked');
        } else {
            $(this).find('input').attr('checked', '');
        }
        $(this).toggleClass('checked');
    })

    //会员中心

    $(".suspend .member").click(function() {
        $(".popup-register").fadeIn();
        $(".popup-register .popup").animate({
            top: '50%'
        })
        $("body").css("overflow", "hidden")
    })
    $(".popup-register .hide").click(function() {
        $(".popup-register").fadeOut();
        $(".popup-register .popup").animate({
            top: '-35%'
        })
        $("body").css("overflow", "auto");
    })

    //微信，QQ，微博边框

    $(".on-4").hover(function() {
        $(this).find(".a1,.a3").stop().animate({
            width: '100%'
        }, 400)
        $(this).find(".a2,.a4").stop().animate({
            height: '100%'
        }, 400)
    }, function() {
        $(this).find(".a1,.a3").stop().animate({
            width: '0px'
        }, 400)
        $(this).find(".a2,.a4").stop().animate({
            height: '0px'
        }, 400)
    })

    /*购物车*/

    /*加*/

    var box = $('.cent'),
        prices = box.find('.price span'),
        ctrlBox = box.find('input');

    $('body').on('click', '.centent-text .plus', function() {
        var thisIndex = $(this).parents('li').index(),
            thisNumBox = $(this).siblings('input'),
            thisPrice = $(this).parents('li').attr('data-price'),
            thisPriceBox = prices.eq(thisIndex),
            thisCtrlBox = ctrlBox.eq(thisIndex);

        if (thisCtrlBox.val() < 9) {
            thisCtrlBox.val(parseInt(thisCtrlBox.val()) + 1)
        } else {
            thisCtrlBox.val(parseInt(thisCtrlBox.val()))
        }

        thisPrice * thisNumBox.val().replace()
        var newVal = (thisPrice * thisNumBox.val()).toString(),
            writeVal = '';
        for (var i = 0; i < newVal.length; i++) {
            if (newVal.length - i == 3) {
                writeVal += ',' + newVal[i];
            } else {
                writeVal += newVal[i];
            }
        }
        thisPriceBox.text(writeVal);
    });

    //减

    $('body').on('click', '.centent-text .minus', function() {

        var thisIndex = $(this).parents('li').index(),
            thisNumBox = $(this).siblings('input'),
            thisPrice = $(this).parents('li').attr('data-price'),
            thisPriceBox = prices.eq(thisIndex),
            thisCtrlBox = ctrlBox.eq(thisIndex);

        if (thisCtrlBox.val() > 0) {
            thisCtrlBox.val(parseInt(thisCtrlBox.val()) - 1)
        } else {
            thisCtrlBox.val(parseInt(thisCtrlBox.val()))
        }

        thisPrice * thisNumBox.val().replace()
        var newVal = (thisPrice * thisNumBox.val()).toString(),
            writeVal = '';
        for (var i = 0; i < newVal.length; i++) {
            if (newVal.length - i == 3) {
                writeVal += ',' + newVal[i];
            } else {
                writeVal += newVal[i];
            }
        }
        thisPriceBox.text(writeVal);
    });

    //获取全部购物车商品数量

    var on5 = $(".popup-shopping li").length;
    $(".on-5").text(on5);

    //购物车滑动

    $(".suspend .shopping").click(function() {
        if ($(".popup-shopping").css('right') == '-340px') {
            $(".popup-shopping").animate({
                right: '45px'
            }, 600)
            $(".suspend .shopping").addClass("shop-color");
            $(".suspend .trilateral").addClass("dot-right");
        } else if ($(".popup-shopping").css('right') == '45px') {
            $(".popup-shopping").animate({
                right: '-340px'
            }, 600)
            $(".suspend .shopping").removeClass("shop-color");
            $(".suspend .trilateral").removeClass("dot-right");
        }
    })

    //多选

    $('body').on("click", ".checkbox-labe3", function() {
        if ($(this).find('input').attr("checked")) {
            $(this).find('input').removeAttr('checked');
        } else {
            $(this).find('input').attr('checked', '');
        }
        $(this).toggleClass('checked');
        var on6 = $(".centent .checked").length;
        $(".on-6").text(on6);
    })

    $(".shopping .tit-left").click(function() {
        if ($(".checkbox-labe3 input").attr("checked")) {
            $(".checkbox-labe3 input").removeAttr('checked');
            $(".checkbox-labe3").removeClass('checked');
            $(".tit-left").removeClass('checked');
        } else {
            $(".checkbox-labe3 input").attr('checked', '');
            $(".checkbox-labe3").addClass('checked');
            $(".tit-left").addClass('checked');
        }

        var on6 = $(".centent .checked").length;
        $(".on-6").text(on6);

    })

    //商品删除

    var popupli = $(".popup-shopping li");

    $(".popup-shopping li").hover(function() {
        $(this).find(".hide").stop().fadeIn(1000);
    }, function() {
        $(this).find(".hide").stop().fadeOut(200);
    })

    $('body').on("click", ".popup-shopping .hide", function() {
        $(this).parent(".popup-shopping li").animate({
            left: '99px',
            opacity: '0'
        }, function() {
            $(this).remove();
        });
        var on5 = $(".popup-shopping li").length;
        $(".on-5").text(on5 - 1);
    })

    //返回顶部
    $(".suspend .top").click(function() {
        $('body,html').animate({ scrollTop: 0 }, 200);
    })

    // 底部动画
    // 获取页面高度
    var situation_height = $(document).height();
    var footer = $(".footer-1").height();
    $(window).scroll(function(e) {
        s = $(document).scrollTop();
        if (s > situation_height - footer - 800) {
            $('.footer1-text').animate({
                top: '84px',
                opacity: '1'
            }, 800)
            $('.footer-2 p').fadeIn(900);
        }
    })

    // 购物车
    $(window).resize(function() {
        var height_shopping = $(window).height() - 206;
        $('.popup-shopping .centent').css('height', height_shopping)
    });
    var height_shopping = $(window).height() - 206;
    $('.popup-shopping .centent').css('height', height_shopping)


    // 预约
    $('.bespeak-popup .hide').click(function() {
        $('.bespeak-popup').fadeOut()
    })

    // 单项选择
    $('body').on('click', '.bespeak-popup li', function() {
        var radioId = $(this).find('input').attr('name');
        $(this).addClass('checked').siblings().removeClass('checked');
        $(this).find('input').attr('checked', 'true');
        $(this).siblings().find('input').removeAttr('checked')
    });
})
